<template>
	<view>
		<up-tabbar :value="value" @change="click1" :activeColor="primary" zIndex="10">
			<up-tabbar-item text="首页">
				<template #active-icon>
					<image class="u-page__item__slot-icon1" src="/static/tabBar/index_active.png"></image>
				</template>
				<template #inactive-icon>
					<image class="u-page__item__slot-icon1" src="/static/tabBar/index.png"></image>
				</template>
			</up-tabbar-item>
			<up-tabbar-item text="物料">
				<template #active-icon>
					<image class="u-page__item__slot-icon1" src="/static/tabBar/materiel_active.png"></image>
				</template>
				<template #inactive-icon>
					<image class="u-page__item__slot-icon1" src="/static/tabBar/materiel.png"></image>
				</template>
			</up-tabbar-item>
			<up-tabbar-item text="订单">
				<template #active-icon>
					<image class="u-page__item__slot-icon1" src="/static/tabBar/order_active.png"></image>
				</template>
				<template #inactive-icon>
					<image class="u-page__item__slot-icon1" src="/static/tabBar/order.png"></image>
				</template>
			</up-tabbar-item>
			<up-tabbar-item text="我的">
				<template #active-icon>
					<image class="u-page__item__slot-icon1" src="/static/tabBar/my_active.png"></image>
				</template>
				<template #inactive-icon>
					<image class="u-page__item__slot-icon1" src="/static/tabBar/my.png"></image>
				</template>
			</up-tabbar-item>
		</up-tabbar>
	</view>
</template>

<script setup>
	// import { colorStore } from "/store/color"
	const primary = ref('')
	import {
		ref
	} from 'vue';
	const props = defineProps({
		value: {
			type: Number,
			default: 0
		},
	});
	onMounted(() => {
		// primary.value = colorStore().list.primary
		primary.value = $use.colorObj().primary
	})
	function click1(e){
		console.log('click1', e);
		if(e==0){
			uni.switchTab({
				url:'/pages/index/index'
			})
		}else if(e == 1){
			uni.switchTab({
				url:'/pages/materiel/materiel'
			})
		}else if(e == 2){
			uni.switchTab({
				url:'/pages/order/order'
			})
		}else if(e == 3){
			uni.switchTab({
				url:'/pages/my/my'
			})
		}
	}
</script>

<style scoped>
	.u-page__item__slot-icon1 {
		width: 48rpx;
		height: 48rpx;
	}
</style>